﻿<!DOCTYPE html>
<!--[if !IE]><!--> <html lang="en"> <!--<![endif]-->
    <head>
        <title>Fudan University - Campus</title>
        <!-- META -->
        <meta charset="utf-8">
        <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
        <meta name="description" content="">

        <!-- FAVICON -->
        <link rel="shortcut icon" href="./favicon.ico">
        <link rel="stylesheet" href="css/style.css">
        <link rel="stylesheet" href="css/home.css">
         


        <!-- Site Wraper -->
        <div class="wrapper">

            <!-- Start Header-->
            <div class="header sticky-header">
                <div class="header-top">
                    <img src="./image/font_logo.png" alt="">
                    <img src="./image/font_logo.png" alt="">
                    <img src="./image/font_logo.png" alt="">
                    <img src="./image/font_logo.png" alt="">
                </div>
                <!-- Navbar -->
                <div class="navbar navbar-default mega-menu" role="navigation">
                    <div class="container header-nav">
                        <div class="navbar-header">
                            <a class="navbar-brand" href="index.html">
                                <img src="image/logo.png" alt="Logo" />
                            </a>
                        </div>

                        <!-- Nav links-->
                        <div class="collapse navbar-collapse mega-menu navbar-responsive-collapse">
                            <ul class="nav navbar-nav">
								<li><a href="index.html">Home</a></li>
                                <li><a href="about.html">About Us</a></li>
								<li><a href="course.html">Course</a></li>
								<li><a href="admission.html">Admission</a></li>
								<li><a href="campus.html">Campus Life</a></li>
                            </ul>
                            <a class="log-in" href="login.html">log in</a>
                        </div>
                    </div>
                </div>
                <!-- End Navbar -->
            </div>
            <!-- End Header -->

            <!-- banner -->
            <div class="home-banner">
                <img class="home-banner-img" src="./image/campus_banner.png" alt="">
                <div class="banner-content banner-other-content">
                    <div class="container">
                        <p class="banner-other-title fb">Campus Life</p>
                        <img class="banner-other-img" src="/image/about_right.png"/>
                    </div>
                </div>
            </div>

            <div class="container contact-us">
                <div class="line"></div>
                <div class="contact-us-box">
                    <p class="contact-us-title fb">Contact Us</p>
                    <div class="contact-us-info">
                        <div class="contact-us-detail">
                            <div>
                                <p class="contact-us-label">Telephone</p>
                                <p class="contact-us-value fb">17362960519</p>
                            </div>
                            <p class="contact-us-line"></p>
                            <div>
                                <p class="contact-us-label">Wechat</p>
                                <p class="contact-us-value fb">15105165284</p>
                            </div>
                        </div>
                        <div class="contact-us-email">
                            <p class="contact-us-label">Email</p>
                            <p class="contact-us-value fb">fisfgov@fudan.edu.cn</p>
                        </div>
                    </div>
                </div>
            </div>

            <div class="container address">
                <div class="line"></div>
                <div class="address-box">
                    <div class="address-box-left">
                        <p class="address-title fb">Address</p>
                        <div>
                            <img class="address-img" src="/image/about_address.png" alt="">
                            <p class="address-info">Address: Fudan University, 220 Handan Road Shanghai，China，200433</p>
                        </div>
                    </div>
                    <div id="gaode_map"></div>
                </div>
            </div>



            <!-- footer -->
            <footer>
                <div class="container">
                    <div class="footer-box">
                        <img class="footer-img" src="/image/logo.png" alt="">
                        <div class="footer-content">
                            <div>
                                <p class="footer-title">Telephone</p>
                                <a class="footer-text" href="tel:+17362960519">17362960519</a>
                            </div>
                            <p class="footer-line"></p>
                            <div>
                                <p class="footer-title">Email</p>
                                <a class="footer-text" href="mailto:fisfgov@fudan.edu.cn">fisfgov@fudan.edu.cn</a>
                            </div>
                            <p class="footer-line"></p>
                            <div>
                                <p class="footer-title">Address</p>
                                <p class="footer-text">Fudan University, 220 Handan Road Shanghai，China，200433</p>
                            </div>
                        </div>
                    </div>
                    <div class="footer-url">
                        <p class="footer-url-title">Friendship link</p>
                        <a class="footer-url-link" href="https://www.fudan.edu.cn/en/">https://www.fudan.edu.cn/en/</a>
                    </div>
                </div>
            </footer>

        </div>





        <!-- JQUERY LIBS -->
        <script type="text/javascript"  src="js/jquery.min.js"></script>
        <script type="text/javascript"  src="js/index.js"></script>
        <script type="text/javascript">
            window._AMapSecurityConfig = {
                securityJsCode: "fea0c889ca9c3c0cc9c239d137476465",
            };
            </script>
            <script src="https://webapi.amap.com/loader.js"></script>
            <script type="text/javascript">
            AMapLoader.load({
                key: "913186ed6b369834fe4d423e77bbd47a", //申请好的Web端开发者 Key，调用 load 时必填
                version: "2.0", //指定要加载的 JS API 的版本，缺省时默认为 1.4.15
            })
                .then((AMap) => {
                    const map = new AMap.Map("gaode_map");
                    const infoWindow = new AMap.InfoWindow({
                        //创建信息窗体
                        isCustom: true, //使用自定义窗体
                        content: "<div>HELLO,AMAP!</div>", //信息窗体的内容可以是任意html片段
                        offset: new AMap.Pixel(16, -45),
                    });
                    const onMarkerClick = function (e) {
                        infoWindow.open(map, e.target.getPosition()); //打开信息窗体
                        //e.target就是被点击的Marker
                    };
                    const marker = new AMap.Marker({
                        viewMode: "2D", //默认使用 2D 模式
                        zoom: 11, //地图级别
                        center: [121.5033, 31.3008],
                        position: [121.5033, 31.3008],
                    });
                    map.add(marker);
                    map.setFitView() 
                    // marker.on("click", onMarkerClick); //绑定click事件
                })
                .catch((e) => {
                console.error(e); //加载错误提示
                });
            </script>

    </body>
</html>

